<template>
	<view class="">
		<MyComponent v-if="flag" :title="title" ></MyComponent>
		<button type="default" @click="qh">组件销毁</button>
		<view class="box">
			<text class="nstyle">{{title}}</text>
			<view class="">
				{{flag?"这是三元运算符":"这是false"}}
			</view>
			<img v-bind:src="imgurl" alt="">
			<view v-for="(item,index) in list" :key="x" class="">
				{{item.name}}{{item.age}}{{index}}
			</view>
			<button type="default" v-on:click="testvon(11,$event)">test按钮</button>
			<button type="primary" @click="setStorage">存储数据</button>
			<button type="primary" @click="getStorage">获取数据</button>
			<button type="primary" @click="removeStorage">移除数据</button>
			<navigator url="../message/index/index" open-type="switchTab">去消息页</navigator>
			<button type="default" @click="golist">去列表</button>
		</view>
		<view class="">
			
		</view>
	</view>
</template>

<script>
	import MyComponent from 'wxcomponents/custom/test.vue'
	export default {
		data() {
			return {
				title: 'wjp',
				flag:true,
				imgurl:'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1596382136380&di=e6a424a781dac26f432c6fdf99eab431&imgtype=0&src=http%3A%2F%2Ft8.baidu.com%2Fit%2Fu%3D1484500186%2C1503043093%26fm%3D79%26app%3D86%26f%3DJPEG%3Fw%3D1280%26h%3D853',
				list:[{
					name:'刘德华',
					age:99,
					id:1,
				},{
					name:'刘德华2',
					age:992,
					id:1,
				},{
					name:'刘德华3',
					age:993,
					id:1,
				},{
					name:'刘德华4',
					age:994,
					id:1,
				}],
			}
		},
		onLoad(options) {
			console.log(options)
		},
		methods: {
			testvon(num,e){
				console.log(num,e)
			},
			setStorage(){
				uni.setStorage({
					key:'id',
					data:'kljlkjlk',
					success() {
						console.log('存储成功')
					}
					})
			},
			getStorage(){
				uni.getStorage({
					key:'id',
					success(res){
						console.log(res)
					}
				})
			},
			removeStorage(){
				uni.removeStorage({
					key:'id',
					success() {
						console.log('移除成功')
					}
				})
			},
			golist(){
				uni.switchTab({
					url:"../list/list/list"
				})
			},
			qh(){
				this.flag = !this.flag
			}
		},
		components:{
			MyComponent
		}
	}
</script>

<style lang="scss">
	@import url("./a.css");

	.img {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.box{
		width: 750rpx;
		// height: 750rpx;
		background:{
			color: $global-color;
		};
	}
	.box img{
		width: 100%;
	}
</style>
